const path = require('path')
const { VueLoaderPlugin } = require('vue-loader')
const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = (env) => {
  return {
    mode: 'development',
    entry: path.join(__dirname, 'src/main.js'),
    output: {
      path: path.join(__dirname, 'dist'),
      filename: '[name].[hash].bundle.js',
    },
    module: {
      rules: [
        {
          test: /\.vue$/,
          use: 'vue-loader',
        },
        {
          test: /\.(css|sass|scss)/i,
          use: ['vue-style-loader', 'css-loader', 'sass-loader'],
        },
        {
          test: /\.(png|jpg|gif)$/i,
          use: [
            {
              loader: 'url-loader',
              options: {
                limit: 8192,
              },
            },
          ],
          type: 'javascript/auto',
        },
        {
          test: /\.(png|jpe?g|gif)$/i,
          use: [
            {
              loader: 'file-loader',
            },
          ],
        },
      ],
    },
    plugins: [
      new VueLoaderPlugin(),
      new HtmlWebpackPlugin({
        template: 'public/index.html',
      }),
    ],
    devServer: {
      port: 8080,
      open: true,
      proxy: {
        '/api': {
          target: 'http://localhost:3000',
          pathRewrite: {
            '^/api': '',
          },
        },
      },
    },
    resolve: {
      alias: {
        '@': path.resolve('src'),
      },
    },
  }
}
